<template>
    <div class="box">
        <div class="header">
            <van-nav-bar title="详情" left-arrow @click-left="$router.go(-1)" />
        </div>
        <div class="meddle">
            <van-swipe :autoplay="3000" lazy-render>
                <van-swipe-item v-for="image in images" :key="image">
                    <img :src="obj.image" />
                    <p>{{ obj.title }}</p>
                </van-swipe-item>
            </van-swipe>

        </div>
        <van-action-bar>
            <van-action-bar-icon icon="chat-o" text="客服" dot />
            <van-action-bar-icon icon="cart-o" text="购物车" badge="5" />
            <van-action-bar-icon icon="shop-o" text="店铺" badge="12" />
            <van-action-bar-button type="warning" text="加入购物车" @click="addCart" />
            <van-action-bar-button type="danger" text="立即购买" />
        </van-action-bar>
    </div>
</template>
<script setup>
import request from '@/utils/request.js'
import { ref, onMounted } from "vue";
const obj = ref([])
import { useRoute, useRouter } from 'vue-router'

const router = useRouter()
const route = useRoute()
onMounted(() => {
    request.get('/detail', {
        params: {
            id: route.params.id
        }
    }).then(res => {
        if (res.data.code == 200) {
            obj.value = res.data.data
        }
    })
})
const images = [
    'https://fastly.jsdelivr.net/npm/@vant/assets/apple-1.jpeg',
    'https://fastly.jsdelivr.net/npm/@vant/assets/apple-2.jpeg',
];

const  addCart=()=>{
    if(localStorage.getItem=='token'){

    }else{
        router.push('/login')
    }
  }
</script>